<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Keen - Responsive Bootstrap Admin & Dashboard Template</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
	<meta name="description" content="Keen - Responsive Bootstrap Admin & Dashboard Template"/>
	<link rel="canonical" href="https://keenthemes.com"/>
	<meta property="og:locale" content="en_US"/>
	<meta property="og:type" content="website"/>
	<meta property="og:title" content="Premium Bootstrap Admin Templates"/>
	<meta property="og:description" content="Keen - Responsive Bootstrap Admin & Dashboard Template"/>
	<meta property="og:url" content="https://keenthemes.com/"/>
	<meta property="og:site_name" content="Keenthemes"/>
	<meta property="article:publisher" content="https://www.facebook.com/keenthemes"/>
	<meta name="twitter:card" content="summary_large_image"/>
	<meta name="twitter:description" content="Keen - Responsive Bootstrap Admin & Dashboard Template"/>
	<meta name="twitter:title" content="Premium Bootstrap Admin Templates"/>
	<meta name="twitter:domain" content="Keenthemes"/>

	<link rel="shortcut icon" href="assets/favicon.ico"/>

	<link href="assets/plugins/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css"><link href="assets/style/flaticon.css" rel="stylesheet" type="text/css"><link href="assets/plugins/line-awesome/css/line-awesome.min.css" rel="stylesheet" type="text/css"><link href="assets/plugins/socicon/css/socicon.css" rel="stylesheet" type="text/css"><link href="assets/plugins/tether/dist/css/tether.min.css" rel="stylesheet" type="text/css"><link href="assets/plugins/perfect-scrollbar/css/perfect-scrollbar.css" rel="stylesheet" type="text/css"><link href="assets/plugins/owl.carousel/dist/assets/owl.carousel.css" rel="stylesheet" type="text/css"><link href="assets/plugins/owl.carousel/dist/assets/owl.theme.default.css" rel="stylesheet" type="text/css"><link href="assets/style/style.css" rel="stylesheet" type="text/css"><link href="assets/plugins/highlight.js/styles/railscasts.css" rel="stylesheet" type="text/css">	<script src="assets/plugins/jquery/dist/jquery.min.js" type="application/javascript"></script><script src="assets/plugins/tether/dist/js/tether.min.js" type="application/javascript"></script><script src="assets/plugins/popper.js/dist/umd/popper.min.js" type="application/javascript"></script><script src="assets/plugins/bootstrap/dist/js/bootstrap.js" type="application/javascript"></script><script src="assets/plugins/perfect-scrollbar/dist/perfect-scrollbar.js" type="application/javascript"></script><script src="assets/plugins/owl.carousel/dist/owl.carousel.js" type="application/javascript"></script><script src="assets/js/custom.js" type="application/javascript"></script><script src="assets/plugins/highlight.js/lib/highlight.js" type="application/javascript"></script><script src="assets/plugins/highlight.js/build/highlight.pack.js" type="application/javascript"></script><script src="assets/js/docs.js" type="application/javascript"></script>
</head>
<body>
<div class="wrapper"><!-- wrapper -->

	<!-- section -->
<section class="section section--header">
    <header><!-- header -->
        <div class="content">
            <div class="header__handler">
                <div class="sidebar">
					<span class="hamburger">
						<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 129 129" enable-background="new 0 0 129 129" width="40px" height="40px">
							<g>
								<path d="m91.4,33.5h-53.8c-2.3,0-4.1,1.8-4.1,4.1 0,2.3 1.8,4.1 4.1,4.1h53.9c2.3,0 4.1-1.8 4.1-4.1-0.1-2.3-1.9-4.1-4.2-4.1z" fill="#FFFFFF"/>
								<path d="m91.4,87.4h-53.8c-2.3,0-4.1,1.8-4.1,4.1 0,2.3 1.8,4.1 4.1,4.1h53.9c2.3,0 4.1-1.8 4.1-4.1-0.1-2.3-1.9-4.1-4.2-4.1z" fill="#FFFFFF"/>
								<path d="m91.4,60.4h-53.8c-2.3,0-4.1,1.8-4.1,4.1 0,2.3 1.8,4.1 4.1,4.1h53.9c2.3,0 4.1-1.8 4.1-4.1-0.1-2.3-1.9-4.1-4.2-4.1z" fill="#FFFFFF"/>
							</g>
						</svg>
					</span>
                    <div class="sidebar__menu_wrap">
                        <span class="sidebar__menu_close">x</span>
                        <ul class="sidebar__menu"><li class="sidebar__menu__item"><a href="index.html" target="" title="Preview"><span>Preview</span></a></li><li class="sidebar__menu__item active"><a href="docs.html" target="" title="Docs"><span>Docs</span></a></li><li class="sidebar__menu__item"><a href="video-tuts.html" target="" title="Video Tuts"><span>Video Tuts</span></a></li><li class="sidebar__menu__item"><a href="changelog.html" target="" title="Changelog"><span>Changelog</span></a></li><li class="sidebar__menu__item highlight"><a href="https://themes.getbootstrap.com/product/keen-the-ultimate-bootstrap-admin-theme/" target="_blank" title="Purchase"><span>Purchase</span></a></li></ul>                    </div>
                </div>
                <a href="https://keenthemes.com/keen" class="logo"><img src="assets/img/logo-keen.png" alt="Keen"></a>
            </div>
            <div class="header__references d-none d-md-block">
                <ul class="main__menu"><li class="main__menu__item"><a href="index.html" target="" title="Preview"><span>Preview</span></a></li><li class="main__menu__item active"><a href="docs.html" target="" title="Docs"><span>Docs</span></a></li><li class="main__menu__item"><a href="video-tuts.html" target="" title="Video Tuts"><span>Video Tuts</span></a></li><li class="main__menu__item"><a href="changelog.html" target="" title="Changelog"><span>Changelog</span></a></li><li class="main__menu__item highlight"><a href="https://themes.getbootstrap.com/product/keen-the-ultimate-bootstrap-admin-theme/" target="_blank" title="Purchase"><span>Purchase</span></a></li></ul>            </div>
        </div>
    </header><!-- header END -->

    <!-- content -->
<div class="content">
    <div class="sub-header">
        <h4 class="title"><span>Keen</span> - The Ultimate Multi-Demo Bootstrap Admin Theme</h4>
        <h4 class="sub-title">
        	The most complete UI/UX template solution for today's web projects of any size
        </h4>
    </div>
</div>
<!-- content END -->
</section>
<!-- section END -->

	<section class="section section--white section--padding"><!-- section -->
	<div id="docs" class="content">

		<div class="contents">
			<!-- contents -->

			<div class="doc-side-menu">
				<i class="la la-bars toggle-btn" data-toggle="collapse" data-target="#menu-content"></i>
				<div class="menu-list">
					<ul id="menu-content" class="menu-content collapse"><li class=""><a href="quick-start.html" >Quick Start</a></li><li class=""><a href="javascript:;" data-toggle="collapse" data-target="#a5c7a03196bfa0" >Install<div class="arrow"></div></a><ul class="sub-menu collapse " id="a5c7a03196bfa0"><li class=""><a href="classic-version.html">Classic Package</a></li><li class=""><a href="installation.html">Default Package</a></li></ul></li><li class=""><a href="demos.html" >Multi-Demo</a></li><li class=""><a href="files-structure.html" >Files Structure</a></li><li class=""><a href="build-tools.html" >Build Tools</a></li><li class=""><a href="javascript:;" data-toggle="collapse" data-target="#a5c7a03196bfb5" >Stylesheets<div class="arrow"></div></a><ul class="sub-menu collapse " id="a5c7a03196bfb5"><li class=""><a href="stylesheets.html">Overview</a></li><li class=""><a href="sass-global.html">Global</a></li><li class=""><a href="sass-demo.html">Demo</a></li></ul></li><li class="active"><a href="javascript:;" data-toggle="collapse" data-target="#a5c7a03196bfbf" aria-expanded="true">Javascripts<div class="arrow"></div></a><ul class="sub-menu collapse show" id="a5c7a03196bfbf"><li class=""><a href="javascripts.html">Overview</a></li><li class="active"><a href="js-global.html">Global</a></li><li class=""><a href="js-demo.html">Demo</a></li></ul></li><li class=""><a href="javascript:;" data-toggle="collapse" data-target="#a5c7a03196bfe9" >Custom Plugins<div class="arrow"></div></a><ul class="sub-menu collapse " id="a5c7a03196bfe9"><li class=""><a href="datatable.html">Keen Datatable</a></li><li class=""><a href="menu.html">Keen Menu</a></li><li class=""><a href="header.html">Keen Header</a></li><li class=""><a href="offcanvas.html">Keen Offcanvas</a></li><li class=""><a href="portlet.html">Keen Portlet</a></li><li class=""><a href="scrolltop.html">Keen Scrolltop</a></li><li class=""><a href="toggle.html">Keen Toggle</a></li><li class=""><a href="wizard.html">Keen Wizard</a></li></ul></li><li class=""><a href="rtl-version.html" >RTL Version</a></li><li class=""><a href="layout-builder.html" >Layout Builder</a></li><li class=""><a href="update.html" >Updates</a></li><li class=""><a href="backend-api.html" >Backend API</a></li><li class=""><a href="references.html" >References</a></li><li class=""><a href="security-notice.html" >Security Notice</a></li></ul>				</div>
			</div>

			<div class="contents__box contents__box--right">
				<!-- contents__box -->
				<div class="section">
	<h2 class="section-head">Global Javascripts</h2>

	<p>
		Keen comes with a globally available <code>KTApp</code> JS class with general purpose helper functions.
		The script file is located at <code>[root]/theme/default/src/theme/framework/lib/app.js</code></p>

	<div class="space"></div>

	<div class="section-content">
		<table class="table-list">
			<thead>
			<tr>
				<th class="force-border">Function</th>
				<th class="force-border">Description</th>
			</tr>
			</thead>
			<thead>
			<tr>
				<th class="force-border" colspan="2">Private Functions</th>
			</tr>
			</thead>
			<tbody>
			<tr>
				<td nowrap><code>initTooltip(el)</code></td>
				<td>Initialize single tooltip.

					<div class="space"></div>

					<table class="table-list">
						<thead>
						<tr>
							<th colspan="3" class="force-border">Input Parameters</th>
						</tr>
						</thead>
						<thead>
						<tr>
							<th class="force-border">Name</th>
							<th class="force-border">Type</th>
							<th class="force-border">Description</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td nowrap><code>el</code></td>
							<td nowrap><code>HTMLElement</code></td>
							<td>HTML element from jQuery object or KTUtil.get() functions.</td>
						</tr>
						</tbody>
					</table>
				</td>
			</tr>
			<tr>
				<td nowrap><code>initTooltips()</code></td>
				<td>Initialize all tooltips found in the page. The HTML elements must have an atrribute <code>data-toggle="kt-tooltip"</code></td>
			</tr>
			<tr>
				<td nowrap><code>initPopover(el)</code></td>
				<td>Initialize single popover.

					<div class="space"></div>

					<table class="table-list">
						<thead>
						<tr>
							<th colspan="3" class="force-border">Input Parameters</th>
						</tr>
						</thead>
						<thead>
						<tr>
							<th class="force-border">Name</th>
							<th class="force-border">Type</th>
							<th class="force-border">Description</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td nowrap><code>el</code></td>
							<td nowrap><code>HTMLElement</code></td>
							<td>HTML element from jQuery object or KTUtil.get() functions.</td>
						</tr>
						</tbody>
					</table>
				</td>
			</tr>
			<tr>
				<td nowrap><code>initPopovers()</code></td>
				<td>Initialize all popovers found in the page. The HTML elements must have an atrribute <code>data-toggle="kt-popover"</code></td>
			</tr>
			<tr>
				<td nowrap><code>initFileInput()</code></td>
				<td>Initialize event on change to the HTML input with class <code>.custom-file-input</code></td>
			</tr>
			<tr>
				<td nowrap><code>initPortlet(el, options)</code></td>
				<td>Initialize single portlet instance.

					<div class="space"></div>

					<table class="table-list">
						<thead>
						<tr>
							<th colspan="3" class="force-border">Input Parameters</th>
						</tr>
						</thead>
						<thead>
						<tr>
							<th class="force-border">Name</th>
							<th class="force-border">Type</th>
							<th class="force-border">Description</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td nowrap><code>el</code></td>
							<td nowrap><code>HTMLElement</code></td>
							<td>HTML element from jQuery object or <code>KTUtil.get()</code> functions.</td>
						</tr>
						<tr>
							<td nowrap><code>options</code></td>
							<td nowrap><code>object</code></td>
							<td>Portlet options</td>
						</tr>
						</tbody>
					</table>
				</td>
			</tr>
			<tr>
				<td nowrap><code>initPortlets()</code></td>
				<td>Initialize all portlets found in the page. The HTML elements must have an atrribute <code>data-ktportlet="true"</code></td>
			</tr>
			<tr>
				<td nowrap><code>initScroll()</code></td>
				<td>Initialize all scrolls found in the page. The HTML elements must have an atrribute <code>data-scroll="true"</code></td>
			</tr>
			<tr>
				<td nowrap><code>initAlerts()</code></td>
				<td>Initialize close alerts found in the page. The HTML elements must have an atrribute <code>data-close=alert"</code></td>
			</tr>
			<tr>
				<td nowrap><code>initSticky()</code></td>
				<td>Initialize all sticky element found in the page. The HTML elements must have an atrribute <code>data-sticky="true"</code></td>
			</tr>
			<tr>
				<td nowrap><code>initAbsoluteDropdown(dropdown)</code></td>
				<td>Initialize Bootstrap dropdown.
					<div class="space"></div>

					<table class="table-list">
						<thead>
						<tr>
							<th colspan="3" class="force-border">Input Parameters</th>
						</tr>
						</thead>
						<thead>
						<tr>
							<th class="force-border">Name</th>
							<th class="force-border">Type</th>
							<th class="force-border">Description</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td nowrap><code>dropdown</code></td>
							<td nowrap><code>HTMLElement</code></td>
							<td>Dropdown HTML element from jQuery object or <code>KTUtil.get()</code> functions.</td>
						</tr>
						</tbody>
					</table>
				</td>
			</tr>
			</tbody>

			<thead>
			<tr>
				<th class="force-border" colspan="2">Public Functions</th>
			</tr>
			</thead>
			<tbody>
			<tr>
				<td nowrap><code>init()</code></td>
				<td>Initialize <code>initComponents()</code> function below.</td>
			</tr>
			<tr>
				<td nowrap><code>initComponents()</code></td>
				<td>Initialize all required components.
					<div class="space"></div>
					<pre><code class="js">initScroll();
initTooltips();
initPopovers();
initAlerts();
initPortlets();
initFileInput();
initSticky();</code></pre>
				</td>
			</tr>
			<tr>
				<td nowrap><code>initTooltips()</code></td>
				<td>Initialize all tooltips found in the page. The HTML elements must have an atrribute <code>data-toggle="kt-tooltip"</code></td>
			</tr>
			<tr>
				<td nowrap><code>initTooltip(el)</code></td>
				<td>Initialize single tooltip.

					<div class="space"></div>

					<table class="table-list">
						<thead>
						<tr>
							<th colspan="3" class="force-border">Input Parameters</th>
						</tr>
						</thead>
						<thead>
						<tr>
							<th class="force-border">Name</th>
							<th class="force-border">Type</th>
							<th class="force-border">Description</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td nowrap><code>el</code></td>
							<td nowrap><code>HTMLElement</code></td>
							<td>HTML element from jQuery object or KTUtil.get() functions.</td>
						</tr>
						</tbody>
					</table>
				</td>
			</tr>
			<tr>
				<td nowrap><code>initPopovers()</code></td>
				<td>Initialize all popovers found in the page. The HTML elements must have an atrribute <code>data-toggle="kt-popover"</code></td>
			</tr>
			<tr>
				<td nowrap><code>initPopover(el)</code></td>
				<td>Initialize single popover.

					<div class="space"></div>

					<table class="table-list">
						<thead>
						<tr>
							<th colspan="3" class="force-border">Input Parameters</th>
						</tr>
						</thead>
						<thead>
						<tr>
							<th class="force-border">Name</th>
							<th class="force-border">Type</th>
							<th class="force-border">Description</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td nowrap><code>el</code></td>
							<td nowrap><code>HTMLElement</code></td>
							<td>HTML element from jQuery object or KTUtil.get() functions.</td>
						</tr>
						</tbody>
					</table>
				</td>
			</tr>
			<tr>
				<td nowrap><code>initPortlet(el, options)</code></td>
				<td>Initialize single portlet instance.

					<div class="space"></div>

					<table class="table-list">
						<thead>
						<tr>
							<th colspan="3" class="force-border">Input Parameters</th>
						</tr>
						</thead>
						<thead>
						<tr>
							<th class="force-border">Name</th>
							<th class="force-border">Type</th>
							<th class="force-border">Description</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td nowrap><code>el</code></td>
							<td nowrap><code>HTMLElement</code></td>
							<td>HTML element from jQuery object or <code>KTUtil.get()</code> functions.</td>
						</tr>
						<tr>
							<td nowrap><code>options</code></td>
							<td nowrap><code>object</code></td>
							<td>Portlet options</td>
						</tr>
						</tbody>
					</table>
				</td>
			</tr>
			<tr>
				<td nowrap><code>initPortlets()</code></td>
				<td>Initialize all portlets found in the page. The HTML elements must have an atrribute <code>data-ktportlet="true"</code></td>
			</tr>
			<tr>
				<td nowrap><code>initSticky()</code></td>
				<td>Initialize all sticky element found in the page. The HTML elements must have an atrribute <code>data-sticky="true"</code></td>
			</tr>
			<tr>
				<td nowrap><code>initAbsoluteDropdown(dropdown)</code></td>
				<td>Initialize Bootstrap dropdown.
					<div class="space"></div>

					<table class="table-list">
						<thead>
						<tr>
							<th colspan="3" class="force-border">Input Parameters</th>
						</tr>
						</thead>
						<thead>
						<tr>
							<th class="force-border">Name</th>
							<th class="force-border">Type</th>
							<th class="force-border">Description</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td nowrap><code>dropdown</code></td>
							<td nowrap><code>HTMLElement</code></td>
							<td>Dropdown HTML element from jQuery object or <code>KTUtil.get()</code> functions.</td>
						</tr>
						</tbody>
					</table>
				</td>
			</tr>
			<tr>
				<td nowrap><code>block(target, options)</code></td>
				<td>Call the loading spinner programatically to block the target element.
					<div class="space"></div>

					<table class="table-list">
						<thead>
						<tr>
							<th colspan="3" class="force-border">Input Parameters</th>
						</tr>
						</thead>
						<thead>
						<tr>
							<th class="force-border">Name</th>
							<th class="force-border">Type</th>
							<th class="force-border">Description</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td nowrap><code>target</code></td>
							<td nowrap><code>HTMLElement</code></td>
							<td>HTML element from jQuery object or <code>KTUtil.get()</code> functions.</td>
						</tr>
						<tr>
							<td nowrap><code>options</code></td>
							<td nowrap><code>object</code></td>
							<td>Block options</td>
						</tr>
						</tbody>
					</table>
				</td>
			</tr>
			<tr>
				<td nowrap><code>unblock(target)</code></td>
				<td>Remove the loading spinner and unblock the target element.
					<div class="space"></div>

					<table class="table-list">
						<thead>
						<tr>
							<th colspan="3" class="force-border">Input Parameters</th>
						</tr>
						</thead>
						<thead>
						<tr>
							<th class="force-border">Name</th>
							<th class="force-border">Type</th>
							<th class="force-border">Description</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td nowrap><code>target</code></td>
							<td nowrap><code>HTMLElement</code></td>
							<td>HTML element from jQuery object or <code>KTUtil.get()</code> functions.</td>
						</tr>
						</tbody>
					</table>
				</td>
			</tr>
			<tr>
				<td nowrap><code>blockPage(options)</code></td>
				<td>Call loading spinner programatically to block the whole page. The laoding spinner is attach to the body tag.
					<div class="space"></div>

					<table class="table-list">
						<thead>
						<tr>
							<th colspan="3" class="force-border">Input Parameters</th>
						</tr>
						</thead>
						<thead>
						<tr>
							<th class="force-border">Name</th>
							<th class="force-border">Type</th>
							<th class="force-border">Description</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td nowrap><code>options</code></td>
							<td nowrap><code>object</code></td>
							<td>Block options</td>
						</tr>
						</tbody>
					</table>
				</td>
			</tr>
			<tr>
				<td nowrap><code>unblockPage()</code></td>
				<td>Call to remove the loading spinner and unblock the page.</td>
			</tr>
			<tr>
				<td nowrap><code>progress(target, options)</code></td>
				<td>Call the spinner to the element.
					<div class="space"></div>

					<table class="table-list">
						<thead>
						<tr>
							<th colspan="3" class="force-border">Input Parameters</th>
						</tr>
						</thead>
						<thead>
						<tr>
							<th class="force-border">Name</th>
							<th class="force-border">Type</th>
							<th class="force-border">Description</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td nowrap><code>target</code></td>
							<td nowrap><code>HTMLElement</code></td>
							<td>HTML element from jQuery object or <code>KTUtil.get()</code> functions.</td>
						</tr>
						<tr>
							<td nowrap><code>options</code></td>
							<td nowrap><code>object</code></td>
							<td>Progress options</td>
						</tr>
						</tbody>
					</table>
				</td>
			</tr>
			<tr>
				<td nowrap><code>unprogress(target)</code></td>
				<td>Remove the spinner from the element.
					<div class="space"></div>

					<table class="table-list">
						<thead>
						<tr>
							<th colspan="3" class="force-border">Input Parameters</th>
						</tr>
						</thead>
						<thead>
						<tr>
							<th class="force-border">Name</th>
							<th class="force-border">Type</th>
							<th class="force-border">Description</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td nowrap><code>target</code></td>
							<td nowrap><code>HTMLElement</code></td>
							<td>HTML element from jQuery object or <code>KTUtil.get()</code> functions.</td>
						</tr>
						</tbody>
					</table>
				</td>
			</tr>
			<tr>
				<td nowrap><code>getStateColor(name)</code></td>
				<td>Get state color by name from the colors list.
					<div class="space"></div>

					<table class="table-list">
						<thead>
						<tr>
							<th colspan="3" class="force-border">Input Parameters</th>
						</tr>
						</thead>
						<thead>
						<tr>
							<th class="force-border">Name</th>
							<th class="force-border">Type</th>
							<th class="force-border">Description</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td nowrap><code>name</code></td>
							<td nowrap><code>string</code></td>
							<td>State color name.</td>
						</tr>
						</tbody>
					</table>
				</td>
			</tr>
			<tr>
				<td nowrap><code>getBaseColor(type, level)</code></td>
				<td>Get base color.
					<div class="space"></div>

					<table class="table-list">
						<thead>
						<tr>
							<th colspan="3" class="force-border">Input Parameters</th>
						</tr>
						</thead>
						<thead>
						<tr>
							<th class="force-border">Name</th>
							<th class="force-border">Type</th>
							<th class="force-border">Description</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td nowrap><code>type</code></td>
							<td nowrap><code>string</code></td>
							<td>Base color type.</td>
						</tr>
						<tr>
							<td nowrap><code>level</code></td>
							<td nowrap><code>number</code></td>
							<td>Type color level.</td>
						</tr>
						</tbody>
					</table>
				</td>
			</tr>
			</tbody>
		</table>
	</div>
</div>			</div>
			<!-- contents END -->

		</div>
	</div>
</section><!-- section END -->

	
	<!-- section -->
	<section class="section section--bg-features shadow-top-inset">
		<div class="content"><!-- content -->
			<div class="row intro-header">
				<div class="desc">
					<h3 class="title">Keen’s Key Features</h3>
					<p class="text">
						Keen empowers your project with virtually limitless array of options<br> 
						to create endless unique projects.
					</p>
					<ul class="listing">
						<li><span class="bullet"></span>Based On <strong>Bootstrap 4.x</strong></li>
						<li><span class="bullet"></span><strong>Multi-Demo</strong> Concept</li>
						<li><span class="bullet"></span><strong>Enterprise Ready</strong> Architect</li>
						<li><span class="bullet"></span>Integrated Build Tools: <strong>Gulp, NPM, Yarn, SASS</strong></li>
						<li><span class="bullet"></span><strong>Full RTL</strong> Support</li>
						<li><span class="bullet"></span>Included <strong>Classic(without build tool) Version</strong></li>
						<li><span class="bullet"></span><strong>Enterprise Ready</strong> Core Framework</li>
						<li><span class="bullet"></span><strong>Full SASS</strong> Support</li>
						<li><span class="bullet"></span>Re-Usable <strong>Component System</strong></li>
						<li><span class="bullet"></span>And many more...</li>
					</ul>
				</div>
			</div>
		</div><!-- content END -->
	</section>
	<!-- section END -->

	<!-- section -->
	<section class="section section--white shadow-top">
		<div class="content content--padding">
			<div class="x-owl-carousel owl-theme" data-items="1" data-loop="1" data-autoplay="1" data-margin="30" data-responsive-Class="true" data-smart-Speed="3000" data-autoplay-Timeout="6000" data-transition-Style="fade">
				<div class="item">
					<blockquote class="blockquote">
						We truly hope that our love and dedication to produce an incredibly powerful high level solution suits all your project needs. We will continue to deliver incredible enterprise ready solutions for Angular, React and VueJS to serve you better. We sincerely hope you enjoyed using Keen as much as we enjoyed building it.
						<p class="blockquote__author">Sean,<span>&nbsp;&nbsp;Keenthemes Co-Author</span></p>
					</blockquote>
				</div>
			</div>
		</div>
	</section>
	<!-- section END -->


	<footer class="section section--bg-footer">
    <img src="assets/img/logo-keenthemes.png" alt="" >
    <form action="//keenthemes.us3.list-manage.com/subscribe/post?u=b10f23244c11e2946463ea844&amp;id=6998d1f883" method="post" id="mc-embedded-subscribe-form"
          name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
        <div class="subscribe">
            <input type="email" name="EMAIL" placeholder="Enter your email to subscribe newsletter">
            <button type="submit" class="button button-subscribe" name="subscribe">Submit</button>
        </div>
    </form>

    <div class="socials">
        <a href="http://twitter.com/keenthemes" target="_blank"><i class="socicon-twitter"></i></a>
        <a href="https://dribbble.com/keenthemes" target="_blank"><i class="socicon-dribbble"></i></a>
        <a href="https://themes.getbootstrap.com/product/keen-the-ultimate-bootstrap-admin-theme/" target="_blank"><img class="img-fluid" src="assets/img/icon-bootstrap.png"></a>
    </div>
</footer>

</div><!-- wrapper END -->

</body>
</html>
